<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>个人资料</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable" />
    <meta content="black" name="apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection" />

    <link rel="stylesheet" href="css/demo.css" />
    <script src="js/ydui.flexible.js"></script>
    <style>
        .cell-left {
            width: 20%
        }
    </style>
</head>

<body>
    <section class="g-flexview">
        <header class="m-navbar">
            <a href="javascript:history.back();" class="navbar-item">
                <i class="back-ico"></i>
            </a>
            <div class="navbar-center">
                <span class="navbar-title">个人资料</span>
            </div>
        </header>

        <section class="g-scrollview">
            <div class="m-cell demo-small-pitch">
                <div class="cell-item">
                    <div class="cell-left">用户昵称</div>
                    <div class="cell-right">
                        <input type="text" id="userName" class="cell-input" value="" placeholder="请输入用户昵称" autocomplete="off" />
                    </div>
                </div>
                <div class="cell-item">
                    <div class="cell-left">游戏角色ID</div>
                    <div class="cell-right">
                        <input type="text" id="gameId" class="cell-input" value="" placeholder="请输入游戏角色ID" autocomplete="off" />
                    </div>
                </div>
                <div class="cell-item">
                    <div class="cell-left">联系QQ</div>
                    <div class="cell-right">
                        <input type="text" id="contact" class="cell-input" value="" placeholder="请输入联系QQ" autocomplete="off" />
                    </div>
                </div>

            </div>
            <div class="m-button">
                <button type="button" id="saveBtn" class="btn-block btn-primary">保存</button>
            </div>
        </section>

    </section>
    <script src="js/jquery.min.js"></script>
    <script src="js/ydui.js"></script>
    <script src="js/ydui.citys.js"></script>
</body>
<script>
    ! function(win, $) {
        var dialog = win.YDUI.dialog;
        $("#saveBtn").click(function() {
            var userName = $("#userName").val();
            var gameId = $("#gameId").val();
            var contact = $("#contact").val();
            if (userName == "") {
                dialog.toast('请输入用户昵称', 'none', 2000);
                return;
            } else if (gameId == "") {
                dialog.toast('请输入游戏角色ID', 'none', 2000);
                return;
            } else if (contact == "") {
                dialog.toast('请输入联系QQ', 'none', 2000);
                return;
            }
            dialog.toast('保存成功', 'none', 2000);
        });
    }(window, jQuery);
</script>

</html>